<template>
	<div class="CompontensViews">
        <div class="bs-tabs">
            <div>
                <el-button :type="activeFlag == index ? 'primary' : ''" size="mini" v-for="(value, index) in tabs_list"
                    :key="index" @click="activeFlag = index" style="width: 15% !important;">
                    {{ value.title }}
                </el-button>
            </div>
        </div>
		<PartsSpecEdit :partsItemLabelList="this.partsItemLabelList"
            :PltCode="this.PltCode"
            :dmgCode="this.dmgCode"
            :selectPartsSpec="this.selectPartsSpec"
            :partsShapeNames="partsShapeNames"
            :damageFactorList="damageFactorList"
            :corrosionLoopNumbers="corrosionLoopNumbers"
            :partsSpecTableCount="partsSpecTableCount"
            v-show="activeFlag == 0"
            @onAddPartsSpec="onAddPartsSpec"
            @onAddPartsSpecCancel="onAddPartsSpecCancel"
            @onEditPartsSpecCancel="onEditPartsSpecCancel"
            @onDeletePartsSpec="onDeletePartsSpec"
            @onSavedPartsSpec="onSavedPartsSpec"
            ref="PartsSpecEdit"/>
	</div>

</template>

<script>
import PartsSpecEdit from "@/components/Customize/Customer127/PartsSpec/views/PartsSpecEdit";
export default {
    props: ["partsItemLabelList", "PltCode", "dmgCode", "selectPartsSpec", "partsShapeNames", "damageFactorList", "corrosionLoopNumbers", "partsSpecTableCount"],
	components: {
        PartsSpecEdit,
    },
	// ["userInfo"],
	// dataプロパティ：変更が検知されるような値
	data() {
		return {
			tabs_list: [
                { title: "部位仕様", },
            ],
            activeFlag: 0,
		}
	},
    methods: {
        onAddPartsSpec() {
			this.$emit("onAddPartsSpec");
		},
        onAddPartsSpecCancel() {
			this.$emit("onAddPartsSpecCancel");
		},
        onEditPartsSpecCancel() {
			this.$emit("onEditPartsSpecCancel");
		},
        onDeletePartsSpec() {
			this.$emit("onDeletePartsSpec");
		},
        onSavedPartsSpec(isConfirmClick) {
			this.$emit("onSavedPartsSpec", isConfirmClick);
		},
    },
};
</script>

<style lang="scss" scoped>
.CompontensViews {
    width: 100%;
    height: 100%;
}

.bs-tabs {
    width: 72%;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    // div {
    //     width: 50%;
    // }

    .el-button {
        margin-left: 0px;
        min-width: 155px;
        width: 155px;
        border-radius: 2px !important;
    }

    .red {
        background-color: rgb(188, 0, 15);
        color: #FFF;
    }

    .addBtn {
        .el-button {
            min-width: 82px;
            width: 82px;
            border-radius: 4px !important;
        }
    }
}
</style>